<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div>
        <h1>The Ajax 01 Page</h1>
        <button onclick="doAjaxStart()">Ajax Get Request Start</button>
        <span id="result"></span>
    </div>
<script>
    function doAjaxStart() {//js中问题的调试-日志，debugger 排除法

        debugger//在浏览器控制台
    //    1.create xhr对象（此对象是Ajax引用的入口对象）
        let xhr=new XMLHttpRequest();
    //    2.设置监听状态（监听客户端与服务端的通讯过程）
        xhr.onreadystatechange=function () {//此函数在客户端与服务器端的通讯状态变化时执行
            //readyState==4表示服务端响应到客户端数据已经接收完成.
            if(xhr.readyState==4){
                if(xhr.status==200){//status==200表示服务端请求处理过程没问题
                    document.getElementById("result").innerHTML=
                        xhr.responseText;//获取服务端响应到客户端的文本信息
                    // let result=xhr.responseText;
                    // document.getElementById("result").innerHTML=result

                }
            }
        }
            //    3.打开一个与服务端指定url的链接
        // let url="http://localhost/doAjaxStart"
        // xhr.open("GET",url,true);
        xhr.open("GET","http://localhost/doAjaxStart",true);
    //    4.发送请求
        xhr.send(null);//这个请求交给谁发送---ajax引擎
        console.log(123123)
    }
</script>
</body>
</html>